<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>表单元素</title>
	</head>
	<body>
		<!-- 表单元素：采集用户信息，并提交信息到服务器 
		采集用户信息元素：input 必须属性 type决定input呈现效果
		重点掌握type中属性值       text     文本框 【省略】
		                         password  密文文本框
								 submit    提交
								 button    按钮  【html4.0写法加value="按钮名称"】
								 reset     重置  结合表单元素
								 color     颜色
								 datetime-local 本地日期时间插件
								 date       年月日插件
								 time       时分插件
								 week       周插件
								 range      滑块
								 file       文件
								 radio      单选框  结合name  checked默认选择
								 checkbox   复选框           checked默认选择
								 image     图片按钮  结合src属性使用
								 hidden    隐藏 结合JS
		-->
		<form>
			<h1>控件元素</h1>
		账号<input type="text"> <br>
		账号1<input  />
		
		密码<input type="password"> <br>
		<input type="submit">
		<input type="button" value="自定义按钮">
		<!-- html5.0写法 -->
		<button>点击按钮</button>
		<input type="reset" /> <br />
		<input type="color" />
		<input type="datetime-local" /> <br />
		<input type="date" />
		<input type="time" />
		<input type="week">
		<input type="range" />
		<input type="file" /> <br />
		男<input type="radio" name="sex" checked="checked"/>
		女<input type="radio" name="sex"/>
		<input type="checkbox" />红烧肉
		<input type="checkbox" checked/>麻辣烫
		<input type="checkbox" />麻辣香锅
		<input type="image" src="img/2.gif" />
		<input type="hidden" />
		
		<h1>下拉列表元素</h1>
		<!-- 层叠元素 快捷键：select>option -->
		发车时间：<select>
			<option> 00:00-24:00</option>
			<option> 00:00-06:00</option>
			<option> 06:00-12:00</option>
			<option> 12:00-18:00</option>
			<option> 18:00-24:000</option>
		</select>
		
		<!-- 超大文本框元素 cols列属性  rows行属性-->
		<h1>超大文本框元素</h1>
		建议：<textarea cols="50" rows="10"></textarea>
		<!-- 细节元素  层叠元素 快捷键details>summary+div -->
		<h1>细节元素</h1>
		<details>
			<summary>征婚启事</summary>
			<div>Lorem ipsum dolor sit amet consectetur adipisicing elit. Deleniti quasi possimus non natus dolore blanditiis doloribus consectetur dicta molestiae expedita, iure totam molestias sapiente omnis nam eius voluptates dolores. Inventore.</div>
		</details>
		</form>
		
		<h1>新元素</h1>
		<!-- 记号笔元素 -->
		周五<mark>放假啦</mark>
		<!-- 度量元素 value度量单位="默认：0min~1max"值  指定最大值跟最小值
		min属性  max属性
		-->
		电量:<meter value="50"min="0" max="100"></meter>
		<h1>--->>求职申请<<---</h1>
		<form>
			<table>
				<tr>
					<td>用户名：</td>
					<td><input type="text"/></td>
				</tr>
				<tr>
					<td><pre>   密码:</pre></td>
					<td><input type="password"></td>
					
				</tr>
				<tr>
					<td><pre>   性别:</pre></td>
					<td>
				    <input type="radio"name="sex" />男
				    <input type="radio"name="sex"/>女
					<input type="radio"name="sex"/>不透露
					</td>
				</tr>
				<tr>
					<td><pre>   头像：</pre></td>
					<td><input type="file"/></td>
				</tr>
					<tr>
						<td></td>
					<td>
						<input type="submit" value="提交"/>
						<input type="reset" value="清除" />
						</td>
						</tr>
						<tr>
							<td></td>
							<td><input type="checkbox"/>不要公开我的信息	</td>
						</tr>
			</table>
			</form>
	</body>
</html>